.error {
  position: absolute;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 1);
  z-index: var(--content-index);
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;

  & > img {
    width: 5rem;
    height: 5rem;
  }

  .btn {
    width: 9.5rem;
    height: 3rem;
    display: flex;
    justify-content: center;
    align-items: center;
    background: var(--theme-color);
    border-radius: 2.5rem;
    color: #fff;
  }

  & > p {
    font-size: 1.25rem;
    line-height: 1.875rem;
    color: rgba(255, 255, 255, 0.8);
    margin-top: 0.5rem;
    margin-bottom: 1.875rem;

    & > span {
      color: var(--theme-color);
    }
  }

  .btnGroup {
    display: flex;

    .b_item {
      width: 15.625rem;
      height: 15.625rem;
      background-color: var(--bg-color);
      border-radius: 0.625rem;
      text-align: center;

      &:first-child {
        margin-right: 1rem;
      }

      .code {
        @apply inline-block;
        width: 8.125rem;
        height: 8.125rem;
      }

      .title {
        font-size: 1.25rem;
        line-height: 1.875rem;
        color: #fff;
        margin-top: 1.25rem;
        margin-bottom: 2.125rem;
      }

      .titleAndroid {
        margin-bottom: 1.25rem;
      }

      .install {
        cursor: pointer;
        font-size: 0.875rem;
        margin: 0;
        line-height: 0.875rem;

        a {
          color: var(--theme-color);
        }
      }

      .installBottom {
        margin: 1rem 0 2.5625rem;
      }

      .errorDown {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 10rem;
        height: 2.625rem;
        border-radius: 2.625rem;
        background-color: var(--theme-color);
        color: #fff;

        img {
          width: 1.5rem;
          height: 1.5rem;
          margin-right: 0.25rem;
        }
      }

      .tips {
        color: #ccc;
        font-size: 0.75rem;
        line-height: 1.125rem;
        margin: 0.75rem 0 0 0;
      }
    }
  }
}

@media screen and (min-width: 68.8125rem) and (max-width: 81.25rem) {
  .error {
    & > img {
      width: 3.75rem;
      height: 3.75rem;
    }

    p {
      font-size: 1.125rem;
      line-height: 1.625rem;
      margin-bottom: 1.125rem;
    }

    .btnGroup {
      .b_item {
        width: 13.75rem;
        height: 13.75rem;

        .code {
          width: 6.25rem;
          height: 6.25rem;
        }

        .title {
          margin-top: 1.25rem;
          margin-bottom: 1.5rem;
        }

        .errorDown {
          width: 8.75rem;
          height: 2.5rem;
          border-radius: 2.5rem;
          font-size: 0.875rem;
        }
      }
    }
  }
}

@media screen and (max-width: 68.75rem) {
  .error {
    & > img {
      width: 2.5rem;
      height: 2.5rem;
    }

    p {
      font-size: 1rem;
      line-height: 1.25rem;
      margin-bottom: 1rem;
    }

    .btnGroup {
      .b_item {
        width: 11.25rem;
        height: 11.25rem;

        .code {
          width: 5rem;
          height: 5rem;
        }

        .title {
          font-size: 1rem;
          margin-top: 0.625rem;
          margin-bottom: 1rem;
        }

        .install {
          line-height: 0.75rem;
          font-size: 0.75rem;
        }

        .installBottom {
          margin: 0.875rem 0 1.25rem;
        }

        .errorDown {
          width: 8.75rem;
          height: 2.5rem;
          border-radius: 2.5rem;
          font-size: 0.875rem;
        }
      }
    }
  }
}
